{% load static %}
{% load notifications_tags %}
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>FBA退款 - 专注于亚马逊退款索赔，找回属于您的每一分钱！</title>
    <meta name="keywords" content="FBA退款,FBA索赔, 亚马逊索赔, 亚马逊退款,amz索赔, amazon索赔">
    <meta name="description" content="FBA退款(fbatk)是专注于FBA退款索赔的第三方软件,全方面分析店铺数据。损坏丢失,发货接收差异,退款未退货，换货未退货等退款索赔问题通通帮你解决！">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <link rel="shortcut icon" href="{% static 'basestatic/img/favicon.png' %}" type="image/x-icon" />
    <link type="text/css" href="{% static 'basestatic/css/style_version20210111.css' %}" rel="stylesheet">
{#    <link type="text/css" href="{% static 'layui-v2.5.7/layui/css/layui.css' %}" rel="stylesheet">#}
{#    <link type="text/css" href="https://www.layuicdn.com/layui-v2.5.7/css/layui.css" rel="stylesheet">#}
    <link type="text/css" href="https://www.layuicdn.com/layui/css/layui.css" rel="stylesheet">
{#    最新#}

{#    <script type="text/javascript" src="{% static 'jquery-3.2.1/jquery-3.2.1.min.js' %}"></script>#}
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>


{#    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/layui/2.5.7/layui.min.js"></script>#}
{#    <script type="text/javascript" src="https://www.layuicdn.com/layui/layui.js"></script>#}
    <script type="text/javascript" src="{% static 'layui-v2.5.7/layui/layui.js' %}"></script>


    <script type="text/javascript" src="{% static 'basestatic/js/common_version20210111.js' %}"></script>
{#    <script type="text/javascript" src="{% static 'notifications/notify.js' %}" ></script>#}



{#    <link type="text/css" href="/static/font-awesome-free/css/fontawesome.min.css" rel="stylesheet">#}
{#    <link type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">#}

</head>
<script>
    {% if not user.is_authenticated %}
        window.location.href = "{% url 'login:sign' %}";
    {% endif %}
</script>

<body>
    <div class="system-head clearfix">
        <a href="{% url 'pages:homepage' %}"><i class="icon-logo-white"></i></a>

        <div class="system-name js-nameOpen">
            <div class="pointer clearfix" >
                <img class="hand" src="{% static 'basestatic/img/default_head.jpg' %}">
            </div>
            <div class="name-slider">
                <div class="name-cont">
                    <div class="head-msg clearfix">
                        <a href="#" class="head-link">
                            <img class="hand" src="{% static 'basestatic/img/default_head.jpg' %}">
                        </a>
                        <div class="fl tl">
                            <p id="name" class="mt5 bold">{{ user.username }}</p>
                        </div>
                    </div>
                    <ul class="setting">
                        <li><a href={% url 'pages:authorization' %}?menuid=112>店铺授权
                                <span class="layui-icon layui-icon-add-circle-fine"
                                    style="float: right; color: #0E7584; font-size: 30px"></span></a></li>
                    </ul>
                    <ul class="setting">
                        <li><a href="javascript:;" onclick="user_center()">个人中心
                                <span class="layui-icon layui-icon-user"
                                    style="float: right; color: #0E7584; font-size: 30px"></span></a></li>
                    </ul>
                    <ul class="setting">
                        <li><a href="{% url 'login:exit' %}">退出登录
                                <span class="layui-icon layui-icon-logout"
                                    style="float: right; color: #0E7584; font-size: 30px"></span></a></li>
                    </ul>
                </div>
            </div>
        </div>
            {% notifications_unread as unread_count %}
         <div class="system-name js-messageOpen">
            <div class="pointer clearfix" >
                <a class="hand"><i class="layui-icon layui-icon-notice" style="font-size: 30px; color: #1E9FFF;"></i></a>
                {% if unread_count > 0 %} <span class="layui-badge live_notify_badge">{{ unread_count }}</span>{% endif %}
            </div>
            <div class="message-slider">
                <div class="name-cont">
                    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                  <ul class="layui-tab-title">
                    <li class="layui-this">未读消息</li>
                    <li><a href="{% url 'my_notifications:my_notifications_center' %}" target="_blank">消息中心</a></li>
                  </ul>
                  <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        {% if unread_count > 0 %}
                            {% for notification in request.user.notifications.unread  %}
                                {% if forloop.counter <= 5 %}
                                    <ul class="message-row">
                                        <span><a href="javascript:;" onclick="show_info('{% url 'my_notifications:notification' notification.pk %}')">{{ notification.verb }}</a></span>
                                        <span style="float: right">{{ notification.timestamp |date:"m-d H:i"  }}</span>
                                    </ul>
                                {% endif %}
                            {% endfor %}
                        {% else %}
                            <ul>暂无未读消息！</ul>
                        {% endif %}
                    </div>
                  </div>
                </div>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function() {
                // 点击空白区域关闭
                $(document).click(function(e) {
                    var _con = $('.js-monitor-remark');
                    var _con2 = $(".remark-cont");
                    var _con3 = $(".system-monitor-main .infor");
                    var _con4 = $(".js-monitor-open");
                    if (!_con.is(e.target) && _con.has(e.target).length === 0 && !_con2.is(e.target) && _con2.has(e.target).length === 0) {
                        $(".remark-cont").hide();
                    }
                    if (!_con2.is(e.target) && _con2.has(e.target).length === 0 && !_con3.is(e.target) && _con3.has(e.target).length === 0 && !_con4.is(e.target) && _con4.has(e.target).length === 0) {
                        $(".system-monitor-main").hide();
                        $(".system-monitor-box .icon-monitor-light").removeClass("active");
                        $("body").css("overflow", "visible");
                    }

                });
            });
        </script>
        <!--        top menu-->
        <ul class="system-head-nav clearfix">
            {% for top_menu in menu.menu %} {% if top_menu.menuId == menu.topmenuId %}
                <li class="active">
                    {% else %}
                    <li>
                        {% endif %}
                        <a href="javascript;"><span class="pointer "> <i class=""></i>{{ top_menu.menuName }}</span>
                        <!-- <i class="icon icon-down"></i> -->
                    </a>
                        <!--  -->
                        <ul class="second-nav">
                            {% for cmenu in top_menu.childMenu %}
                                <li class="second-width">
                                {# <i class="{{ cmenu.childMenuIcon}}"></i>#}
                                <font class="op">{{ cmenu.childMenuTitle }}</font>
                                <ul class="third-nav clearfix">
                                    {% for smenu in cmenu.sunMenu %} {% if smenu.sunMenuId == menu.sunmenuId %}
                                        <li class="active">
                                    {% else %}
                                        <li class="">
                                    {% endif %}
                                        <a href={% url smenu.sunUrl  %}?menuid={{ smenu.sunMenuId }}>
                                            <font class=" limit">{{ smenu.sunMenuTitle }}</font>
                                        </a></li>
                                    {% endfor %}
                                </ul>
                            </li>
                            {% endfor %}
                        </ul>
                    </li>
            {% endfor %}
        </ul>

    </div>

    <div style="margin-top: 50px;">

        {% block basecontent %} {% endblock basecontent %}

    </div>
    <script>
    layui.use('element', function(){
      var element = layui.element;

    });

    function my_special_notification_callback(data) {
        var unread_count = data['unread_count'];
        if(unread_count >0){
            $('.live_notify_badge').text(unread_count);
        }
    }

    function reload() {
           window.location.reload();
       }
    </script>
{#    自动刷新消息内容#}
{#    {% register_notify_callbacks callbacks='fill_notification_list,fill_notification_badge' %}#}
    <script>
        function user_center() {
            layui.use('layer', function() {
                var layer = layui.layer;
                layer.config({
                    extend: 'myskin/style.css',
                });

                layer.open({
                    type: 2,
                    title: "个人中心",
                    offset: '20%',
                    area: ['50%', '60%'],
                    shade: [0.6, '#393D49'],
                    shadeClose: true,
                    move: false,
                    resize: false,
                    content: "{% url 'profile:user_center' %}",
                    skin: 'mypop-ups', //仅限于单个模态框的使用
                });

            });
        }
        function show_info(url) {
            console.log(url);
            layui.use('layer', function() {
                var layer = layui.layer;
                layer.config({
                    extend: 'myskin/style.css',
                });
                layer.open({
                    type: 2,
                    title: "消息",
                    offset: '20%',
                    area: ['50%', '60%'],
                    shade: [0.6, '#393D49'],
                    shadeClose: true,
                    move: false,
                    resize: false,
                    content: url,
                    skin: 'mypop-ups', //仅限于单个模态框的使用
                    end: function () {
                        reload();
                    }
                },);

            });
        }
    </script>

</body>

</html>